@import url('@src/total.less');
.header {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-start;

  height: 56px;
  > img {
    width: 12px;
    margin-right: 16px;
  }
  > span {
    font-size: @font-size-base;

    color: #7e889c;
  }
}
.block {
  margin-bottom: 12px;

  counter-reset: num;

  box-shadow: @box-shadow-base;

  .border-radius();
  .border(1px, @border-color-split);
}
.block-line {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;

  box-sizing: border-box;
  height: 48px;
  padding: 12px 24px;

  cursor: pointer;

  border-bottom: 1px solid @border-color-split;
  &.self {
    .block-line-left > span::after {
      content: '（本人）';

      color: @grey-6;
    }
  }
  &.unfull {
    .block-line-right::before {
      font-size: @font-size-sm;

      margin-right: 16px;

      content: '信息不全，请完善！';

      color: @error-color;
    }
  }
}
.block-line-left {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-start;
  > span {
    font-size: @font-size-base;

    margin-left: 12px;

    color: @grey-8;
  }
  &::before {
    font-size: @font-size-sm;

    display: inline-block;

    min-width: 16px;
    height: 16px;
    padding: 0 4px;

    content: counter(num);
    counter-increment: num;
    text-align: center;

    color: #fff;
    border-radius: 50%;
    background-color: @primary-color;
  }
}

.block-line-right {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: flex-start;
}

.btn-line {
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: space-between;

  height: 64px;
  padding: 0 24px;
  > span {
    font-size: @font-size-base;

    color: @grey-8;
  }
}

.btn-box {
  height: 32px;
  padding-left: 24px;

  border-left: 1px solid #f0f0f0;
}

.btn {
  height: 32px;
  padding: 4px 15px;

  cursor: pointer;

  color: @primary-color;
  border: 0;
  background-color: #fff;

  .border();
  .border-radius();
  &:hover {
    border-color: @primary-color;
  }
}

.respondent {
  .block-line-left::before {
    background-color: @warning-color;
  }
  .btn {
    color: @warning-color;
    &:hover {
      border-color: @warning-color;
    }
  }
}
